<%@ page language="java" contentType="text/html;charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>${p.appName}</title>
<script type="text/javascript" src="http://fusion.qq.com/fusion_loader?appid=${p.appId}&platform=pengyou" charset="utf-8" ></script>
<script type="text/javascript" src="${resUrl}/js/jquery-1.3.2.min.js"></script>
<script type="text/javascript">
	//调整高度
	$(document).ready(function(){
		$.ajaxSetup({cache:false});
		//setInterval('refresh()',3600*10); //10分钟续期一次
	});
	
	//openkey续期
	function refresh(){
		$.getScript("${resUrl}/ru.pet?openid=${openid}&openkey=${openkey}");
	}
	
	setTimeout("setHeight()", 1000);
	setTimeout("initTabs('play')",1000 );
	
	function setHeight() {
		fusion2.canvas.setHeight({height:1000});
	}
	
	function test() {
		alert('test');
		fusion2.canvas.setHeight({height:1000});
	}

	function getLocation() { return document.location.href; }
	function getOpenID() { return "${openid}"; }
	function getOpenKey() { return "${openkey}"; }
	
	function showTab(name, sel){
		if (name==_currentTab && !sel) { return; }
		if ($("#tab_"+name)==null) { return; }
		if(sel) {
			$("#tab_" + name).css("display","none");
			$("#tab_" + name + "s").css("display","block");
		} else {
			$("#tab_" + name + "s").css("display","none");
			$("#tab_" + name).css("display","block");
		}
	}

	//  显示菜单
	function show(tabName) {
		$("#flash-canvas").addClass('novis');
		$("#help-canvas").addClass('novis');
		if('help' == tabName) {
			$("#help-canvas").removeClass('novis');
			_currentTab = 'help';
			initTabs('help');
			
			var _tmpUrl = '${resUrlTwitter}/help.pet';
			$.post(_tmpUrl, {openid:'${openid}', openkey:'${openkey}',platform:'${platform}'}, function(data) {
				$("#help-canvas").html(data);
			});
		} else if('home' == tabName) {
			$("#flash-canvas").removeClass('novis');
			initTabs('play');
		}
	}
	
	var _currentTab;
	function initTabs(current){
		_currentTab = current;
		showTab("play", false);
		showTab("forum", false);
		showTab("query", false);
		showTab("change", false);
		showTab("help", false);
		showTab("invite", false);
		showTab(current, true);
	}

	//邀请好友
	function inviteFriend(){
		fusion2.dialog.invite ({
			msg  :"邀请你来玩~",
			img :"http://ctc.qzonestyle.gtimg.cn/qzonestyle/act/qzone_app_img/app12309_12309_75.png",
			context :"invite",
			// 可选。用户操作后的回调方法。
			onSuccess : function (opt) { alert("邀请成功" + opt.context); },
			// 可选。用户取消操作后的回调方法。
			onCancel : function () {alert("邀请取消");},
			// 可选。对话框关闭时的回调方法。
			onClose : function () {alert("邀请关闭");}
		});
	}
	//Q点充值
	function rechargeQPoint() {
		fusion2.dialog.recharge ({ onClose : function () { } });
	}

	//Q点查询
	function checkBalance() {
		fusion2.dialog.checkBalance ({ onClose : function () { } });
	}

	//回家
	function toHome(){
		  fusion.nav.toHome();
	}
	
	//去好友家
	function toFriendHome(openid){
		  fusion.nav.toFriendHome(openid);
	}
	
	//重新刷新
	function reload(){
		document.location.href=document.location.href;
	}

	//窗口最大化API，但没有权限
	function fullWindow() {
		fusion2.control.showFullWindow( {
		   title:'应用的标题',
		   height:850, 
		   width:1000, 
		   url:'http://apps.pengyou.com/888?adtag=applist_shouye',
		   context:'full-window',
		   onLoad:function (ret) {},
		   onClose:function (ret){} } 
	   );
	}
	
	//去其他游戏
	function toApp(appid){
		fusion.nav.toApp({appid:appid});
	}
	
	//显示登录窗口
	function showLoginBox(){
		  fusion.dialog.showloginBox({appid:'${p.appId}'});
	}

	//appInfo
	function appInfo(){
	    var browser = {
	            msie: false, firefox: false, opera: false, safari: false,
	            chrome: false, netscape: false, appname: 'unknown', version: 0
	        },
	        userAgent = window.navigator.userAgent.toLowerCase();
	    if ( /(msie|firefox|opera|chrome|netscape)\D+(\d[\d.]*)/.test( userAgent ) ){
	        browser[RegExp.$1] = true;
	        browser.appname = RegExp.$1;
	        browser.version = RegExp.$2;
	    } else if ( /version\D+(\d[\d.]*).*safari/.test( userAgent ) ){ // safari
	        browser.safari = true;
	        browser.appname = 'safari';
	        browser.version = RegExp.$2;
	    }
	    return browser.appname+browser.version;
	}

	//收藏夹
	function addbookmark(){
		var name = "${p.appName}";
		var url = "http://app.pengyou.qq.com/appframe.php?appid=21641&height=950&width=1&frame=http%3A%2F%2Fapp21641.qzoneapp.com%2F";
		if ((navigator.appName == "Microsoft Internet Explorer") && (parseInt(navigator.appVersion) >= 4))
			window.external.AddFavorite(url, name);
		else if (navigator.appName == "Netscape")
			window.sidebar.addPanel(name, url, '');
		else
			alert("请同时按CTRL和D键收藏本页!");
	}

	//testPayment 第一步:支付准备
	function paymentPrepare(context) {
		$.post("pay-prepare.pet", { 
			openid: "${openid}", openkey: "${openkey}", pfkey:"${pfkey}", platform:"${platform}",
			uid:"${gu.id}",level:"${gu.level}", context:context 
			},function(data){

				alert(data.token);
				alert(data.url_params);
				var url_param = data.url_params;
				var context = "0";
				
				fusion2.dialog.buy ({
					// 必须。 表示Q点购买物品的url参数，url_params是调用qz_buy_goods / v3/pay/buy_goods接口的返回。
					param : url_param,
					// 可选。表示是否使用沙箱测试环境。true：使用； false或不指定：不使用。
					sandbox : true,
					//可选。前台使用的上下文变量，用于回调时识别来源。
					context: context,
					//可选。用户购买成功时的回调方法，其中opt.context为上述context参数。如果用户购买成功，则立即回调onSuccess，当用户关闭对话框时再回调onClose。
					onSuccess : function (opt) { 
						alert("用户购买成功");
					},
					//可选。用户取消购买时的回调方法，其中opt.context为上述context参数。如果用户购买失败或没有购买，关闭对话框时将先回调onCancel再回调onClose。
					onCancel : function (opt) {
						alert("用户取消购买");
					},
					//可选。对话框关闭时的回调方法，主要用于对话框关闭后进行UI方面的调整，onSuccess和onCancel则用于应用逻辑的处理，避免过度耦合。
					onClose : function () {
						alert("用户取消购买");
					}
				});
			},"json");
		
	}
	
	//发送分享(feed)
	function sendSimpleFeed(feedId, feedContent) {
		var picurl="http://qzonestyle.gtimg.cn/qzonestyle/act/qzone_app_img/app21641_21641_75.png";
		var app_custom="feedid:" + feedId;
		tweet(feedContent, picurl, app_custom, "${statsServer}", "${openid}");
	}
	
	//赠送礼物
	function sendFreeGift( giftId, title, msg, desc) {
		fusion2.dialog.sendRequest({
			type : 'freegift', 
			receiver : [''],
			stat:'action_id',
			title : title,
			msg : msg,
			img:'${resUrl}/freegift/giftid_' + giftId + '.png',
			desc : desc,
			context : 'context',
			callback : '',
			onSuccess : function (opt) {
				var receiver = opt.receiver;
				if(receiver != null && receiver != "") {
					$.post("${appPrefixPengyou}/send-free-gift.pet?receiver=" + receiver,{openid:"${openid}", openkey:"${openkey}",uid:"${gu.id}", sign:"${request_key}", type: "0", giftid: giftId});
				}
			},
			onCancel:function (opt) { },
			onClose:function () { }
		});
	}

	//赠送及索要礼物
	function askFreeGift( giftId, title, msg, desc) {
		fusion2.dialog.sendRequest({
			type : 'request', 
			receiver : [''],
			stat:'action_id',
			title : title,
			msg : msg,
			img:'${resUrl}/freegift/giftid_' + giftId + '.png',
			desc : desc,
			context : 'context',
			callback : '',
			onSuccess : function (opt) {
				var receiver = opt.receiver;
				if(receiver != null && receiver != "") {
					$.post("${appPrefixPengyou}/send-free-gift.pet?receiver=" + receiver,{openid:"${openid}", openkey:"${openkey}",uid:"${gu.id}", sign:"${request_key}", type: "1", giftid: giftId});
				}
			},
			onCancel : function (opt) { },
			onClose : function () { }
		});
	}
	
</script>
<style type="text/css">
	/* css Global Config*/
	*{margin:0;padding:0;}
	html{overflow:hidden!important;}
	body,div,form,dl,dt,dd,img,h1,h2,h3,h4,h5,h6,ul,ol,li,p,span,table,th,td,a{margin:0;padding:0;border:0;}
	body{font-family: "Microsoft YaHei", "宋体", Verdana, Arial, Helvetica, sans-serif;font-size:12px;}
	img{border:none;vertical-align:middle;}
	ul{list-style-type:none;}
	th, td, input{font-size:12px;}
	h2, h3{font-size:14px;}
	button{border:none;cursor:pointer;background:none;font-size:12px;text-align:center;}
	select{border:1px solid;padding-top:2px;font-size:12px;}
	.clear{clear:both;font-size:1px;height:0;visibility:hidden;line-height:0px;}
	.clearfix:after{content:"";display:block;clear:both;}
	.vis {display:block;}
	.novis {display:none;}
	/* css Global Config*/
</style>
</head>
<body>
<div id="body-canvas"> <!-- body-canvas BEGIN -->
	<div id="menu-canvas" style="height:60px;width:760px;text-align:center;background:url(${resUrl}/images/pengyou-tab/banner.png) no-repeat left bottom;"><!-- menu-canvas START -->
	
		<div style="float:left;width:120px;margin-top:16px;margin-left:18px;" onmouseover="showTab('play', true);" onmouseout="showTab('play', false);">
		    <a href="javascript:void(0);" onclick="show('home')" style="color:white">
				<img id="tab_play" width="115" height="44" src="${resUrl}/images/pengyou-tab/play.png" alt="开始游戏" style="border:0 none"/>
				<img id="tab_plays" width="115" height="44" class="novis" src="${resUrl}/images/pengyou-tab/plays.png" alt="开始游戏" style="border:0 none"/></a></div>
				
		<div style="float:left;width:120px;margin-top:16px;" onmouseover="showTab('invite', true);" onmouseout="showTab('invite', false);">
		    <a href="javascript:void(0);" onclick="inviteFriend();" style="color:white">
				<img id="tab_invite" width="115" height="44" src="${resUrl}/images/pengyou-tab/invite.png" alt="邀请好友" style="border:0 none"/>
				<img id="tab_invites" width="115" height="44" class="novis" src="${resUrl}/images/pengyou-tab/invites.png" alt="邀请好友" style="border:0 none"/></a></div>
				
		<div style="float:left;width:115px;height:34;margin-top:25px;" onmouseover="showTab('microblog', true);" onmouseout="showTab('microblog', false);">
		    <a href="http://t.qq.com/qqmarket" target="_blank" style="color:white">
				<img id="tab_microblog" width="109" height="34" align="left" src="${resUrl}/images/pengyou-tab/microblog.png" alt="收听微博" style="border:0 none"/>
				<img id="tab_microblogs" width="109" height="34" align="left" class="novis" src="${resUrl}/images/pengyou-tab/microblogs.png" alt="收听微博" style="border:0 none"/></a></div>
				
		<div style="float:left;width:109px; margin-top:16px;" onmouseover="showTab('forum', true);" onmouseout="showTab('forum', false);">
			<a href="http://sobar.soso.com/b/3007832_1363" target="_blank" style="color:white">
				<img id="tab_forum" width="105" height="44" src="${resUrl}/images/pengyou-tab/forum.png" alt="玩家论坛" style="border:0 none"/>
				<img id="tab_forums" width="105" height="44" class="novis" src="${resUrl}/images/pengyou-tab/forums.png" alt="玩家论坛" style="border:0 none"/></a></div>
				
		<div style="float:left;width:105px;margin-top:25px;" onmouseover="showTab('help', true);" onmouseout="showTab('help', false);">
		    <a href="javascript:void(0);" onclick="show('help');" style="color:white">
				<img id="tab_help" width="102" height="34" src="${resUrl}/images/pengyou-tab/help.png" alt="新手帮助" style="border:0 none"/>
				<img id="tab_helps" width="102" height="34" class="novis" src="${resUrl}/images/pengyou-tab/helps.png" alt="新手帮助" style="border:0 none"/></a></div>
				
		<div style="float:left;width:120px;margin-top:25px;" onmouseover="showTab('hztq', true);" onmouseout="showTab('hztq', false);">
		    <a href="http://vip.qzone.com/act?id=MA20111101161555" target="_blank" style="color:white">
				<img id="tab_hztq" width="109" height="34" align="left" src="${resUrl}/images/pengyou-tab/vip.png" alt="黄钻特权" style="border:0 none"/>
			    <img id="tab_hztqs" width="109" height="34" align="left" class="novis" src="${resUrl}/images/pengyou-tab/vips.png" alt="黄钻特权" style="border:0 none"/></a></div>
			    
		<%-- 
	    <div style="float:left;padding-left:112px;padding-top:40px;z-index:99;">
		<a href="http://baobeizhanzheng.qzoneapp.com/shortcut.jsp" onmouseover="showTab('adddesktop', true);" onmouseout="showTab('adddesktop', false);" style="color:white">
			<img id="tab_adddesktop" src="http://app21641.imgcache.qzoneapp.com/app21641/images/pengyou-tab/adddesktop.png" alt="桌面快捷方式" style="border:0 none"/>
			<img id="tab_adddesktops" class="novis" src="http://app21641.imgcache.qzoneapp.com/app21641/images/pengyou-tab/adddesktops.png" alt="桌面快捷方式" style="border:0 none"/>
		</a></div>--%>
	</div><!-- menu-canvas END-->
	
	<div id="flash-canvas" style="width:760px; height:690px;"><!-- flash-canvas -->
		<object id="petflash" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="760" height="690">
			<param name="quality" value="high" />
			<param name="allowFullScreen" value="true" />
			<param name="bgcolor" value="#f8f9ec" />
			<param name="wmode" value="opaque" />
			<param name="menu" value="false" />
			<param name="allowScriptAccess" value="always" />
			<param name="movie" value="${p.resUrl}/${p.flashVersion}/Game.swf" />
			<param name="FlashVars" value="openid=${openid}&openkey=${openkey}&uid=${gu.id}&coinserver=${p.appPrefixTwitter}/&secret=${gu.secret}&server=${gu.server}&port=${gu.port}&version=${resUrl}/${p.flashVersion}&site=tapp&statsserver=${statsServer}" />
			<embed src="${p.resUrl}/${p.flashVersion}/Game.swf" flashvars="openid=${openid}&openkey=${openkey}&uid=${gu.id}&coinserver=${p.appPrefixTwitter}/&secret=${gu.secret}&server=${gu.server}&port=${gu.port}&version=${resUrl}/${p.flashVersion}&site=tapp&statsserver=${statsServer}"></embed>
		</object>
	</div><!-- flash-canvas END-->
	
	<div id="help-canvas" class="novis" style="width:760px; height:690px;"><!-- help-canvas --></div>
	
	<div id="explain-canvas" style="width:760px; height:129px;"><!-- explain-canvas -->
		<img width="760" height="129" src="${resUrl}/images/pengyou-tab/event.png" alt="每天必做5件事" style="border:0 none"/>
	</div><!-- explain-canvas END-->

	<div id="foot-canvas" style="width:760px;"> <!-- fot-canvas -->
		<div style="text-align:center;font-weight:bold;font-size:12px;padding:4px;">ID:${gu.id}</div>
		<div style="text-align:center; background:#f7f7f7;border:1px solid #cccccc;color:#999999;font-size:12px;line-height:150%;margin:5px 0;padding:5px 10px;">
			声明：如您在游戏中遇到问题，请点击<a href="http://kf.qq.com" target="_blank"><u>kf.qq.com</u></a>会由专业的客服团队为您解答。
		</div>
	</div><!-- fot-canvas -->
	
	</div><!-- body-canvas END -->

	<div id="test-canvas">
		<a href="javascript:void(0);" onclick="rechargeQPoint();">充Q点</a>
		<a href="javascript:void(0);" onclick="checkBalance();">查询Q点</a>
		<a href="javascript:void(0);" onclick="toApp('26641');">去其它游戏26641</a>
		<a href="javascript:void(0);" onclick="showLoginBox();">显示登录窗口</a>
		<a href="javascript:void(0);" onclick="appInfo();">appInfo</a>
		<a href="javascript:void(0);" onclick="fullWindow();">窗口最大化</a>
		<a href="javascript:void(0);" onclick="reload();">重载</a>
		<a href="javascript:void(0);" onclick="toFriendHome('0');">去好友家</a>
		<a href="javascript:void(0);" onclick="toHome();">回家</a>
		<a href="javascript:void(0);" onclick="inviteFriend();">邀请好友</a>
		<a href="javascript:void(0);" onclick="paymentPrepare('{id:1}');">购买</a>
		<a href="javascript:void(0);" onclick="refresh();">openkey续期</a>
		<a href="${resUrl}game-shortcut.pet">生成快捷方式</a>
		<a href="javascript:void(0);" onclick="addbookmark();">收藏这个游戏</a>
		<a href="javascript:void(0);" onclick="sendFreeGift(10, '能量', '我在玩游戏的时候想到了你，送你一份礼物，如果你喜欢，就跟我一起来玩吧~', '用于增加能量值');">测试赠送免费礼物</a>
		<a href="javascript:void(0);" onclick="askFreeGift(10, '能量', '我想要一份礼物,能送给我吗？', '用于增加能量值');">测试索要免费礼物</a>
		<a href="javascript:void(0);" onclick="sendSimpleFeed(2, '测试feed');">测试发表说说</a>
	</div>

</body>
</html>

<%--
	/**
	 * 发送礼物
	 */
	function sendRequest(type,title,desc,msg,img,context,giftid,receiver){
		  if(type=="0"){
			  fusion2.dialog.sendRequest({
				    appid: 21641,
				    type: 'freegift',
				    stat: type,
				    title: title,
				    desc: desc,
				    msg: msg,
				    img: img,
				    context: context,
				    callback: "",
				    onSuccess: function (opt) {
				    	var receiver = opt.receiver;
				    	if(receiver != null && receiver != ""){
				        	$.get('http://app21641.qzoneapp.com/receiveGift.market?openid=${openid}&openkey=${openkey}&uid=${gu.id}&receiver='+receiver+'&type='+type+'&giftid='+giftid+'&abc='+((new Date()).getTime()), function(data) {
				    		});
				    	}
				    },
				    onCancel: function (opt) {
				    },
				    onClose: function () {
				    }
				  });
		  }
	}*/
	/*
	//分享
	function sendShare(title,desc,summary,picUrl){
	    fusion2.dialog.share({url:"http://apps.pengyou.com/21641?time="+((new Date()).getTime()),desc:desc,title:title,summary:summary,pics:picUrl});
	}

	*/

	<a href= 'javascript:;' onclick='showPopupInvite();return false;'> 

function leaveMessage(surl,sname,ruid){
	$("#surl").attr("src",surl); 
	$("#surl").attr("title",sname);
	$("#sname").text(sname);
	$("#fmessage").val("");
	easyDialog.open({
		container : 'messageBoxDiv',
        follow: 'marketDiv',
        followX: 200,
        followY: 100
	});
}
function sendLeaveMessage(){
	var marketFlash = document["market"] || window["market"];
	var content = $("#fmessage").val();
	if(content == null || content.length<=0 ){
		alert("留言内容不能为空");
		return;
	} else if(content.length > 100){
		alert("留言内容不能超过100个字符!");
		return;
	}
	if(marketFlash != null) {
		marketFlash.getJSContext(content);
		easyDialog.close();
	}
}--%>

